<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Dialogs in PyGTK</title>
<link rel="stylesheet" href="/cfg/format.css" type="text/css">
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="keywords" content="GUI, PyGTK, dialogs, Python, programming, Linux">
<meta name="description" content="Dialogs in PyGTK">
<meta name="language" content="en">
<meta name="author" content="Jan Bodnar">
<meta name="distribution" content="global">

<script type="text/javascript" src="/lib/jquery.js"></script>
<script type="text/javascript" src="/lib/common.js"></script>

</head>

<body>

<div class="container">

<div id="wide_ad" class="ltow">
<script type="text/javascript"><!--
google_ad_client = "pub-9706709751191532";
/* 160x600, August 2011 */
google_ad_slot = "2484182563";
google_ad_width = 160;
google_ad_height = 600;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</div>

<div class="content">


<a href="/" title="Home">Home</a>&nbsp;
<a href="..">Contents</a>


<h1>Dialogs in PyGTK</h1>


<p>
In this part of the PyGTK programming tutorial, we will introduce dialogs. 
</p>

<script type="text/javascript"><!--
google_ad_client = "pub-9706709751191532";
/* NewSquare */
google_ad_slot = "0364418177";
google_ad_width = 300;
google_ad_height = 250;
//-->
</script> 
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js"> 
</script>

<p>
Dialog windows or dialogs are an indispensable part of most modern GUI applications.
A dialog is defined as a conversation between two or more persons. In a computer
application a dialog is a window which is used to "talk" to the application.
And vice versa. 
A dialog is used to input data, modify data, change the application settings etc.
Dialogs are important means of communication between a user and a computer program.
</p>


<h2>Message dialogs</h2>

<p>
Message dialogs are convenient dialogs that provide messages to the user of 
the application. The message consists of textual and image data. 
</p>

<div class="codehead">messages.py</div>
<pre class="code">
#!/usr/bin/python

# ZetCode PyGTK tutorial 
#
# This example shows message
# dialogs
#
# author: jan bodnar
# website: zetcode.com 
# last edited: February 2009


import gtk


class PyApp(gtk.Window): 
    def __init__(self):
        super(PyApp, self).__init__()
        
        self.set_size_request(250, 100)
        self.set_position(gtk.WIN_POS_CENTER)
        self.connect("destroy", gtk.main_quit)
        self.set_title("Message dialogs")
        
        
        table = gtk.Table(2, 2, True);
        
        info = gtk.Button("Information")
        warn = gtk.Button("Warning")
        ques = gtk.Button("Question")
        erro = gtk.Button("Error")

        
        info.connect("clicked", self.on_info)
        warn.connect("clicked", self.on_warn)
        ques.connect("clicked", self.on_ques)
        erro.connect("clicked", self.on_erro)
        
        table.attach(info, 0, 1, 0, 1)
        table.attach(warn, 1, 2, 0, 1)
        table.attach(ques, 0, 1, 1, 2)
        table.attach(erro, 1, 2, 1, 2)
        
        
        self.add(table)
        self.show_all()

    def on_info(self, widget):
        md = gtk.MessageDialog(self, 
            gtk.DIALOG_DESTROY_WITH_PARENT, gtk.MESSAGE_INFO, 
            gtk.BUTTONS_CLOSE, "Download completed")
        md.run()
        md.destroy()
        
    
    def on_erro(self, widget):
        md = gtk.MessageDialog(self, 
            gtk.DIALOG_DESTROY_WITH_PARENT, gtk.MESSAGE_ERROR, 
            gtk.BUTTONS_CLOSE, "Error loading file")
        md.run()
        md.destroy()
    
    
    
    def on_ques(self, widget):
        md = gtk.MessageDialog(self, 
            gtk.DIALOG_DESTROY_WITH_PARENT, gtk.MESSAGE_QUESTION, 
            gtk.BUTTONS_CLOSE, "Are you sure to quit?")
        md.run()
        md.destroy()
    
    
    def on_warn(self, widget):
        md = gtk.MessageDialog(self, 
            gtk.DIALOG_DESTROY_WITH_PARENT, gtk.MESSAGE_WARNING, 
            gtk.BUTTONS_CLOSE, "Unallowed operation")
        md.run()
        md.destroy()
    

PyApp()
gtk.main()
</pre>

<p>
In our example, we will show four kinds of message dialogs. 
Information, Warning, Question and Error message
dialogs.
</p>

<pre class="explanation">
 info = gtk.Button("Information")
 warn = gtk.Button("Warning")
 ques = gtk.Button("Question")
 erro = gtk.Button("Error")
</pre>

<p>
We have four buttons. Each of these buttons will show a different kind of message dialog. 
</p>

<pre class="explanation">
 md = gtk.MessageDialog(self, 
     gtk.DIALOG_DESTROY_WITH_PARENT, gtk.MESSAGE_INFO, 
         gtk.BUTTONS_CLOSE, "Download completed")
 md.run()
 md.destroy()
</pre>

<p>
If we click on the info button, the Information dialog is displayed. 
The <b class="keyword">MESSAGE_INFO</b> specifies the type of the
dialog. The <b class="keyword">BUTTONS_CLOSE</b> specifies the button to 
be displayed in the dialog. The last parameter is the message dislayed. 
The dialog is displayed with the <b class="keyword">run()</b> method. 
The programmer must also call either the <b class="keyword">destroy()</b> or the 
<b class="keyword">hide()</b> method.
</p>


<br>
<img src="/img/gui/pygtk/information.png" alt="Information message dialog">&nbsp;&nbsp;
<img src="/img/gui/pygtk/warning.png" alt="Warning message dialog">&nbsp;&nbsp;
<img src="/img/gui/pygtk/question.png" alt="Question message dialog">&nbsp;&nbsp;
<img src="/img/gui/pygtk/error.png" alt="Error message dialog">
<br>
<br>


<h2>AboutDialog</h2>

<p>
The <b class="keyword">AboutDialog</b> displays information about the application. 
<b class="keyword">AboutDialog</b> can display a logo, the name of the application, 
version, copyright, website or licence information. 
It is also possible to give credits to the authors, documenters, translators and artists.
</p>

<div class="codehead">aboutdialog.py</div>
<pre class="code">
#!/usr/bin/python

# ZetCode PyGTK tutorial 
#
# This example demonstrates the
# AboutDialog dialog
#
# author: jan bodnar
# website: zetcode.com 
# last edited: February 2009


import gtk


class PyApp(gtk.Window): 
    def __init__(self):
        super(PyApp, self).__init__()
        self.set_size_request(300, 150)
        self.set_position(gtk.WIN_POS_CENTER)
        self.connect("destroy", gtk.main_quit)
        self.set_title("About battery")
        
        
        button = gtk.Button("About")
        button.set_size_request(80, 30)
        button.connect("clicked", self.on_clicked)
        
        fix = gtk.Fixed()
        fix.put(button, 20, 20)
   
        self.add(fix)
        self.show_all()

    def on_clicked(self, widget):
        about = gtk.AboutDialog()
        about.set_program_name("Battery")
        about.set_version("0.1")
        about.set_copyright("(c) Jan Bodnar")
        about.set_comments("Battery is a simple tool for battery checking")
        about.set_website("http://www.zetcode.com")
        about.set_logo(gtk.gdk.pixbuf_new_from_file("battery.png"))
        about.run()
        about.destroy()

PyApp()
gtk.main()
</pre>

<p>
The code example uses a <b class="keyword">AboutDialog</b> with some of it's features. 
</p>

<pre class="explanation">
 about = gtk.AboutDialog()
</pre>

<p>
We create an <b class="keyword">AboutDialog</b>. 
</p>

<pre class="explanation">
 about = gtk.AboutDialog()
 about.set_program_name("Battery")
 about.set_version("0.1")
 about.set_copyright("(c) Jan Bodnar")
</pre>

<p>
We specify the name, version and the copyright.
</p>

<pre class="explanation">
 about.set_logo(gtk.gdk.pixbuf_new_from_file("battery.png"))
</pre>

<p>
This line creates a logo. 
</p>


<br>
<img src="/img/gui/pygtk/about.png" alt="AboutDialog">
<div class="figure">Figure: AboutDialog</div>
<br>


<h2>FontSelectionDialog</h2>

<p>
The <b class="keyword">FontSelectionDialog</b> is a dialog for selecting fonts. 
It is typically used in applications, that do some text editing or formatting. 
</p>

<div class="codehead">fontdialog.py</div>
<pre class="code">
#!/usr/bin/python

# ZetCode PyGTK tutorial 
#
# This example works with the
# FontSelection dialog
#
# author: jan bodnar
# website: zetcode.com 
# last edited: February 2009


import gtk
import pango


class PyApp(gtk.Window): 
    def __init__(self):
        gtk.Window.__init__(self)
        self.set_size_request(300, 150)
        self.set_position(gtk.WIN_POS_CENTER)
        self.connect("destroy", gtk.main_quit)
        self.set_title("Font Selection Dialog")
        
        
        self.label = gtk.Label("The only victory over love is flight.")
        button = gtk.Button("Select font")
        button.connect("clicked", self.on_clicked)

        fix = gtk.Fixed()
        fix.put(button, 100, 30)
        fix.put(self.label, 30, 90)
        self.add(fix)

        self.show_all()

    def on_clicked(self, widget):
        fdia = gtk.FontSelectionDialog("Select font name")
        response = fdia.run()
              
        if response == gtk.RESPONSE_OK:
            font_desc = pango.FontDescription(fdia.get_font_name())
            if font_desc:
                self.label.modify_font(font_desc)
        
        fdia.destroy()


PyApp()
gtk.main()
</pre>

<p>
In the code example, we have a button and a label. We show the 
<b class="keyword">FontSelectionDialog</b> by clicking on the button.
</p>

<pre class="explanation">
 fdia = gtk.FontSelectionDialog("Select font name")
</pre>

<p>
We create the <b class="keyword">FontSelectionDialog.</b>
</p>

<pre class="explanation">
 if response == gtk.RESPONSE_OK:
     font_desc = pango.FontDescription(fdia.get_font_name())
     if font_desc:
         self.label.modify_font(font_desc)
</pre>

<p>
If we click on the OK button, the font of the label widget changes to the
one, that we selected in the dialog. 
</p>

<br>
<img src="/img/gui/pygtk/fontdialog.png" alt="FontSelectionDialog">
<div class="figure">Figure: FontSelectionDialog </div>
<br>


<h2>ColorSelectionDialog</h2>

<p>
<b class="keyword">ColorSelectionDialog</b> is a dialog for selecting a color. 
</p>

<div class="codehead">colordialog.py</div>
<pre class="code">
#!/usr/bin/python

# ZetCode PyGTK tutorial 
#
# This example works with the
# ColorSelection dialog
#
# author: jan bodnar
# website: zetcode.com 
# last edited: February 2009


import gtk


class PyApp(gtk.Window): 
    def __init__(self):
        super(PyApp, self).__init__()
        
        self.set_size_request(300, 150)
        self.set_position(gtk.WIN_POS_CENTER)
        self.connect("destroy", gtk.main_quit)
        self.set_title("Color Selection Dialog")
        
        
        self.label = gtk.Label("The only victory over love is flight.")
        button = gtk.Button("Select color")
        button.connect("clicked", self.on_clicked)

        fix = gtk.Fixed()
        fix.put(button, 100, 30)
        fix.put(self.label, 30, 90)
        self.add(fix)

        self.show_all()

    def on_clicked(self, widget):
        cdia = gtk.ColorSelectionDialog("Select color")
        response = cdia.run()
              
        if response == gtk.RESPONSE_OK:
            colorsel = cdia.colorsel
            color = colorsel.get_current_color()
            self.label.modify_fg(gtk.STATE_NORMAL, color)
        
        cdia.destroy()


PyApp()
gtk.main()
</pre>

<p>
The example is very similar to the previous one. This time we change the color of the label. 
</p>

<pre class="explanation">
 cdia = gtk.ColorSelectionDialog("Select color")
</pre>

<p>
We create the <b class="keyword">ColorSelectionDialog</b>.
</p>

<pre class="explanation">
 if response == gtk.RESPONSE_OK:
     colorsel = cdia.colorsel
     color = colorsel.get_current_color()
     self.label.modify_fg(gtk.STATE_NORMAL, color)
</pre>

<p>
If the user pressed OK, we get the color and modify the label's color. 
</p>

<br>
<img src="/img/gui/pygtk/colordialog.png" alt="ColorSelectionDialog">
<div class="figure">Figure: ColorSelectionDialog </div>

<hr class="btm">

<p>
In this part of the PyGTK programming tutorial, we worked with PyGTK built-in dialogs. 
</p>


<br>
<div class="center"> 
<script type="text/javascript"><!--
google_ad_client = "pub-9706709751191532";
/* horizontal */
google_ad_slot = "1734478269";
google_ad_width = 468;
google_ad_height = 60;
//-->
</script> 
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js"> 
</script> 
</div> 
<br>


<div class="botNav, center">
<span class="botNavItem"><a href="/">Home</a></span> ‡ <span class="botNavItem"><a href="..">Contents</a></span> ‡ 
<span class="botNavItem"><a href="#">Top of Page</a></span>
</div>


<div class="footer">
<div class="signature">
<a href="/">ZetCode</a> last modified February 9, 2009  <span class="copyright">&copy; 2007 - 2012 Jan Bodnar</span>
</div>
</div>

</div> <!-- content -->

</div> <!-- container -->

</body>
</html>
